// 导入React
import React from "react";

// 在JSX中使用JS表达式
function App() {
  // 字符串类型
  const name = "Jack"
  // 数字类型
  const age = 18
  // 数组类型
  const hobbies = ['吃饭','睡觉','打豆豆']
  const jsxArr = [<div>React</div>, <div>Vue</div>, <div>Angular</div>]
  // 对象类型
  const obj = {name: 'Rose', age: 18}
  // 三元表达式
  // 问 1 &gt; 0 吗？{1>0 ? '是的': '不是'}
  // 函数类型
  const fun = () => {
    return (
      <div>我是函数返回的内容</div>
    )
  }
  // JSX表达式类型
  const jsx = (
    <div>我是jsx表达式</div>
  )

  return (
    <div>
      <h1 className="title">
        Hello {name}，我今年{age}岁
      </h1>
      <h1 style={ {color: 'red'} }>
        {hobbies.join(',')}
      </h1>
      <h1>
        {obj.name} 年龄：{obj.age}
      </h1>
      <h1>
        问 1 &gt; 0 吗？{1>0 ? '是的': '不是'}
      </h1>
      <h1>{fun()}</h1>
      <h1>{jsx}</h1>
    </div>
  );
}

export default App;
